import React from 'react';
import { Button, Toast, List, InputItem, ImagePicker, DatePicker, Radio } from 'antd-mobile';
import { createForm } from 'rc-form';
import * as request from '../request';
import moment from 'moment';

const Item = List.Item;
const apiURL = "/api/services/app/Edu_EventGrowth/";
class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: {},
            loading: false,
        }
    }
    componentDidMount() {
        var cid = parseInt(this.props.state.match.params.id);
        const { currentChild } = this.props.state;
        if (currentChild && cid !== 0) {
            this.props.form.setFieldsValue({
                childId: currentChild.id,
                name: currentChild.name,
                eventDate: new Date(),
                eventType: 'basic',
            });
        }
    }
    onSubmit = () => {
        const { currentChild } = this.props.state;
        var cid = parseInt(this.props.state.match.params.id);
        this.props.form.validateFields((error, value) => {
            this.setState({ loading: true });
            if (cid !== 0) {
                value.id = cid;
            }
            if (currentChild) {
                value.childId = currentChild.id;
            }
            value.eventType = 'basic';
            value.eventDate = moment(value.eventDate).format('YYYY-MM-DD');
            console.log(value);
            if (!error) {
                if (cid !== 0) {
                    this.doUpdate(value);
                }
                else {
                    this.doCreate(value)
                }
            }
            else
                this.setState({ loading: false });
        });
    }
    doUpdate = (value) => {
        request.put(apiURL + 'Update', value).then((response) => {
            if (response) {
                if (response.success) {
                    Toast.info('更新成功！');
                    this.props.state.history.push('/Growth');
                }
                else {
                    Toast.fail(response.error.message);
                }
                this.setState({ loading: false });
            }
        });
    }
    doCreate = (value) => {
        request.post(apiURL + 'Create', value).then((response) => {
            if (response) {
                if (response.success) {
                    Toast.info('记录成功！');
                    this.props.state.history.push('/Growth');
                }
                else {
                    Toast.fail(response.error.message);
                }
                this.setState({ loading: false });
            }
        });
    }
    render() {
        const { loading } = this.state;
        const { getFieldProps, getFieldError } = this.props.form;
        return (
            <form style={{ marginBottom: 60 }}>
                <List>
                    <DatePicker
                        mode="date"
                        {...getFieldProps('eventDate', {
                            rules: [
                                { required: true, message: '请选择检查日期' }
                            ],
                        })}
                    >
                        <List.Item arrow="horizontal">检查日期</List.Item>
                    </DatePicker>
                    <InputItem {...getFieldProps('headCirc', {
                        rules: [
                            { required: true }
                        ],
                    })} type='money' moneyKeyboardAlign="left" extra="CM"> 头围 </InputItem>
                    <InputItem {...getFieldProps('weight', {
                        rules: [
                            { required: true }
                        ],
                    })} type='money' moneyKeyboardAlign="left" extra="KG"> 体重 </InputItem>
                    <InputItem {...getFieldProps('height', {
                        rules: [
                            { required: true }
                        ],
                    })} type='money' moneyKeyboardAlign="left" extra="CM"> 身高 </InputItem>
                    <Item>
                        <Button type="primary" onClick={this.onSubmit} loading={loading} disabled={!this.state.data}>提交</Button>
                    </Item>
                </List>
            </form>
        )
    };
}

export default createForm()(App);
